import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
import 'package:get/get.dart';
import 'package:pornhub_app/components/easy_toast.dart';
import 'package:pornhub_app/views/mine/frontpage/controller/set_pwd_controller.dart';
import 'package:pornhub_app/views/mine/frontpage/set_pwd_success_pop.dart';

import '../../../assets/styles.dart';
import '../../../utils/color.dart';

class SetPasswordPage extends GetView<SetPwdController> {
  SetPasswordPage({super.key});

  final TextEditingController _textEditingController = TextEditingController();

  @override
  Widget build(BuildContext context) {
    final bgColor = Styles.color.bgColor;

    return Scaffold(
      backgroundColor: bgColor,
      appBar: AppBar(
        backgroundColor: Colors.transparent,
        iconTheme: const IconThemeData(color: Colors.white),
        title: Text("设置应用密码锁",
            textAlign: TextAlign.center,
            style: TextStyle(
              color: COLOR.hexColor('#ffffff'),
              fontSize: 16.w,
              fontWeight: FontWeight.w600,
            )),
        centerTitle: true,
      ),
      body: _buildBody(context),
    );
  }

  Widget _buildBody(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        SizedBox(height: 60, width: MediaQuery.sizeOf(context).width),
        Obx(() {
          return Text(
            controller.isAgain.value == true ? '请再次确认以密码' : '请设置密码',
            style: TextStyle(
              color: Colors.white,
              fontSize: 15.w,
              fontWeight: FontWeight.w600,
            ),
          );
        }),
        Offstage(
          offstage: true,
          child: TextField(
            controller: _textEditingController,
            focusNode: controller.textNode,
            keyboardType: TextInputType.number,
            inputFormatters: <TextInputFormatter>[
              LengthLimitingTextInputFormatter(6),
              FilteringTextInputFormatter.digitsOnly
            ],
            onChanged: (value) {
              controller.text.value = value;
              // 再次填写
              if (controller.isAgain.value == true) {
                controller.resultDataAgain.value = value;
                // 再次填写完成
                if (value.length == 6) {
                  controller.isAgain.value = false;
                  _textEditingController.clear();
                  if (controller.resultDataNew.value ==
                      controller.resultDataAgain.value) {
                    controller.service
                        .savelockPassword(controller.resultDataNew.value);
                    // 存储密码
                    SmartDialog.showLoading(
                        msg: '',
                        animationBuilder: (controllers, child, animationParam) {
                          return SetPwdSuccessPop(
                            tap: () {
                              controller.service.saveMineAppLock(true);
                              SmartDialog.dismiss();
                              Get.back(result: true);
                            },
                          );
                        });
                  } else {
                    // 两次密码输入不一致
                    controller.resultDataNew.value = '';
                    controller.resultDataAgain.value = '';
                    EasyToast.show('两次密码输入不一致');
                  }
                }
              } else {
                // 首次填写
                controller.resultDataNew.value = value;
                // 首次填写完成
                if (value.length == 6) {
                  controller.isAgain.value = true;
                  _textEditingController.clear();
                }
              }
            },
          ),
        ),
        const SizedBox(height: 20),
        GestureDetector(
          behavior: HitTestBehavior.opaque,
          onTap: () {
            controller.textNode.requestFocus();
          },
          child: Obx(() {
            if (controller.isAgain.value == true) {
              return _buildNumberWidget(
                  controller.resultDataAgain.value.length);
            } else {
              return _buildNumberWidget(controller.resultDataNew.value.length);
            }
          }),
        ),
      ],
    );
  }

  Widget _buildNumberWidget(int length) {
    return Container(
      alignment: Alignment.center,
      width: double.infinity,
      child: SizedBox(
        height: 28,
        child: ListView.builder(
          shrinkWrap: true,
          padding: EdgeInsets.zero,
          scrollDirection: Axis.horizontal,
          physics: const NeverScrollableScrollPhysics(),
          itemCount: 6,
          itemExtent: 47,
          itemBuilder: (BuildContext context, int index) {
            bool showPoint = index < length;
            return _buildNumberItemWidget(index, showPoint);
          },
        ),
      ),
    );
  }

  Widget _buildNumberItemWidget(int index, bool showPoint) {
    return Container(
      margin: EdgeInsets.symmetric(horizontal: 5.w),
      width: 42.w,
      height: 28.w,
      alignment: Alignment.center,
      decoration: BoxDecoration(
        color: COLOR.hexColor('#ffffff'),
        borderRadius: BorderRadius.circular(6.0),
      ),
      // child: showPoint
      //     ? Container(
      //         height: 10,
      //         width: 10,
      //         decoration: BoxDecoration(
      //           color: Colors.green,
      //           borderRadius: BorderRadius.circular(6),
      //         ),
      //       )
      //     : Container(),
      child: showPoint
          ? Text(controller.text.value[index],
              style: TextStyle(
                  color: COLOR.hexColor("#1A1A1A"),
                  fontSize: 14.w,
                  fontWeight: FontWeight.w600))
          : Container(),
    );
  }
}
